<div class="row animate fadeIn">
    <div class="ibox-title" style="border:none;"><h5 style="color: #00afef"><i>Add</i></h5>
        <div class="ibox-tools">    
             <button class="btn btn-primary btn-sm save-btn-tab" id="save_im">Save</button>
             <a id="cancel_add" class="btn btn-sm btn-outline btn-info cancel-btn-tab">Cancel</a>
             <a id="complete_btn" class="btn btn-sm btn-outline btn-success cancel-btn-tab">Done</a>
        </div>
     </div>
     <div class="ibox-content">
      <form class="form-horizontal" id="im_request_form">
       <div class="row">
         <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Case No.</label>
                <div class="col-lg-4">
                  <?php foreach($case_no as $cn): ?>
                   <input readonly type="text" name="case_no" value="<?php echo $cn->val; ?>" class="form-control text-right">
                  <?php endforeach; ?>
                </div>
            </div>
         </div>
         <div class="col-sm-6">
          <div class="form-group">
              <label class="col-lg-4 control-label">Reported Date</label>
                <div class="col-lg-8">
                  <input type="date" readonly value="<?php echo date('Y-m-d'); ?>" name="reported_date" class="form-control">
                </div>
              </div>
          </div>
       </div>
       <div class="row">
          <div class="col-sm-6">
           <div class="form-group">
            <label class="col-lg-4 control-label">Case Type</label>
              <div class="col-lg-8">
                <select name="case_type" class="form-control chosen">
                  <option value="">--</option>
                  <?php foreach($case_type as $ct): ?>
                  <option value="<?php echo $ct->lookup_code; ?>"><?php echo $ct->meaning; ?></option>
                  <?php endforeach; ?>
                </select>
              </div>
          </div>
          <!-- <input type="hidden" name="caller_acct_id" /> -->
         </div>
         <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Case Date</label>
                <div class="col-lg-8">
                  <input type="date" value="" name="case_date" class="form-control">
                </div>
            </div>
         </div>
       </div>
       <div class="row">
         <div class="col-sm-6">
           <div class="form-group">
              <label class="col-lg-4 control-label">Caller Name</label>
                <div class="col-lg-8">
                  <input type="text" name="caller_name" class="form-control">
                </div>
            </div>
         </div>
         <div class="col-sm-6">
            <!-- <div class="form-group">
                <label class="col-lg-4 control-label">Caller Account ID</label>
                  <div class="col-lg-8">
                    <div class="input-group">
                      <input type="text" name="caller_id" class="form-control">
                      <span class="input-group-btn">
                        <button type="button" class="btn btn-success btn-sm" id="search_num"><i class="fa fa-search"></i></button>
                      </span>
                    </div>
                  </div>
              </div> -->
           <div class="form-group">
            <label class="col-lg-4 control-label">Caller Account ID</label>
              <div class="col-lg-8">
                <input type="text" name="caller_acct_id" class="form-control">
              </div>
          </div>
         </div>
       </div>
       <div class="row">
         <div class="col-sm-6">
           <div class="form-group">
            <label class="col-lg-4 control-label">Caller Contact</label>
              <div class="col-lg-8">
                <input type="text" name="caller_contact" class="form-control">
              </div>
          </div>
         </div>
         <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Caller Address</label>
                <div class="col-lg-8">
                  <textarea name="caller_address" class="form-control"></textarea>
                </div>
            </div>
         </div>
       </div>
        <div class="row">
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Category</label>
                <div class="col-lg-8">
                  <select name="category" class="form-control chosen">
                    <option value="">--</option>
                    <?php foreach($category as $c): ?>
                    <option value="<?php echo $c->category_id; ?>"><?php echo $c->category_name; ?></option>
                    <?php endforeach; ?>
                  </select>
                </div>
            </div>
          </div>
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Sub Category</label>
                <div class="col-lg-8">
                  <select name="sub_category" class="form-control chosen">
                  </select>
                </div>
            </div>
            <!--  <div class="form-group">
             <label class="col-lg-4 control-label">Impact</label>
               <div class="col-lg-8">
                 <select name="impact" class="form-control chosen">
                   <option value="">--</option>
                   <?php foreach($impact as $imp): ?>
                   <option value="<?php echo $imp->lookup_code; ?>"><?php echo $imp->meaning; ?></option>
                   <?php endforeach; ?>
                 </select>
               </div>
                        </div> -->
          </div>
        </div>
        <div class="row">
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Case Title</label>
                <div class="col-lg-8">
                  <input type="text" name="case_title" class="form-control">
                </div>
            </div>
          </div>
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Desired Date</label>
                <div class="col-lg-8">
                  <input type="date" value="" name="desired_date" class="form-control">
                </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-12">
            <div class="form-group">
              <label class="col-lg-2 control-label">Case Details</label>
                <div class="col-lg-10">
                  <textarea rows="3" name="case_details" class="form-control">
                  </textarea>
                </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Department</label>
                <div class="col-lg-8">
                  <select name="department" class="form-control chosen">
                    <option value="">--</option>
                    <?php foreach($department as $dep): ?>
                    <option value="<?php echo $dep->lookup_code; ?>"><?php echo $dep->meaning; ?></option>
                      <?php endforeach; ?>
                  </select>
                </div>
            </div>
          </div>
          <div class="col-sm-6">
              <div class="form-group">
              <label class="col-lg-4 control-label">Assign To</label>
                <div class="col-lg-8">
                  <select name="assigned_to" class="form-control chosen">
                    <!-- <option value="">--</option>
                    <?php foreach($assigned_to as $ass): ?>
                    <option value="<?php echo $ass->user_id; ?>"><?php echo $ass->first_name." ".$ass->last_name; ?></option>
                                      <?php endforeach; ?> -->
                  </select>
                </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Impact</label>
                <div class="col-lg-8">
                  <select name="impact" class="form-control chosen">
                    <option value="">--</option>
                    <?php foreach($impact as $imp): ?>
                    <option value="<?php echo $imp->lookup_code; ?>"><?php echo $imp->meaning; ?></option>
                    <?php endforeach; ?>
                  </select>
                </div>
            </div>
          </div>
          <div class="col-sm-6">
            <div class="form-group">
              <label class="col-lg-4 control-label">Urgency</label>
                <div class="col-lg-8">
                  <select name="urgency" class="form-control chosen">
                    <option value="">--</option>
                    <?php foreach($urgency as $ur): ?>
                    <option value="<?php echo $ur->lookup_code; ?>"><?php echo $ur->meaning; ?></option>
                    <?php endforeach; ?>
                  </select>
                </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-6">
             <div class="form-group">
                <label class="col-lg-4 control-label">Activity Status</label>
                  <div class="col-lg-8">
                    <select name="activity_status" class="form-control chosen">
                      <option value="">--</option>
                      <?php foreach($activity_status as $as): ?>
                      <option value="<?php echo $as->lookup_code; ?>" <?php echo ($as->description == "default" ? 'selected' : ''); ?> ><?php echo $as->meaning; ?></option>
                      <?php endforeach; ?>
                    </select>
                  </div>
              </div>  
          </div>
          <div class="col-sm-6">
              <div class="form-group">
              <label class="col-lg-4 control-label">Case Status</label>
                <div class="col-lg-8">
                  <select name="case_status" class="form-control chosen">
                    <option value="">--</option>
                    <?php foreach($case_status as $cst): ?>
                    <option value="<?php echo $cst->lookup_code; ?>" <?php echo ($cst->description == "default" ? 'selected' : ''); ?> ><?php echo $cst->meaning; ?></option>
                    <?php endforeach; ?>
                  </select>
                </div>
            </div>
          </div>
        </div>
      </form>
      <!-- <button data-toggle="button" class="btn btn-primary btn-sm btn-outline" id="show_hist_btn">Show History</button> -->
    </div>
    <div class="ibox-content" id="cases_history" style="display: none;">
      <table class="table table-hovered">
        <thead>
            <tr>
                <th>Action</th>
                <th>Comments</th>
                <th>Related Doc Type</th>
                <th>Action Date</th>
                <th>Action By</th>
            </tr>
        </thead>
        <tbody>
          <tr>
            <td align="center" colspan="6">No History.</td>    
          </tr>
        </tbody>
      </table>
    </div>
 </div>
 <script>
    $(document).ready(function(){
            $('#complete_btn').hide();
            $('textarea').val('');
            $('.input-group.date').datepicker({
                todayBtn: "linked",
                clearBtn: true,
                autoclose: true,
                todayHighlight: true
            });

            $('.i-checks').iCheck({
                    checkboxClass: 'icheckbox_square-green',
                    radioClass: 'iradio_square-green',
            });

            $('select').chosen({width : "100%"});

            $('#show_hist_btn').click(function(){
              $("#cases_history").slideToggle();
            });

            var user_list = new Array();

            <?php foreach($assigned_to as $ass): ?>
              user_list.push({user_id : "<?php echo $ass->user_id; ?>", name: '<?php echo $ass->first_name." ".$ass->last_name; ?>', department : "<?php echo $ass->department; ?>",user_name: '<?php echo $ass->user_name ?>'});
            <?php endforeach; ?>

            $(document).on('change','#im_request_form select[name=category]',function(){
              $.ajax({
                type: "POST",
                url: "<?php echo base_url($this->session->userdata('forajax').'/get_category_by_id'); ?>",
                data: { "id" : $(this).val() },
                dataType: 'json',
                async: true,
                success: function(data){
                    var tmp = "";
                    if(data.length > 0){
                      $.each(data, function(i, item) {
                        if(data[i].default_department != null || data[i].default_department != ''){
                          $('#im_request_form select[name=department]').val(data[i].default_department);
                          getAss(data[i].default_department, data[i].default_assign_to);
                        }
                      });
                    $('select').trigger('chosen:updated');
                    }
                }
              });
             $.ajax({
                type: "POST",
                url: "<?php echo base_url($this->session->userdata('forajax').'/get_sub_category_by_category_id'); ?>",
                data: { "id" : $(this).val() },
                dataType: 'json',
                async: true,
                success: function(data){
                    var tmp = "";
                    if(data.length > 0){
                      tmp += "<option value=''>--</option>";

                      $.each(data, function(i, index) {
                        tmp += "<option value='"+ data[i].sub_category_id +"'>" + data[i].sub_category_name + "</option>";

                      });
                    }

                     $('#im_request_form select[name=sub_category]').html(tmp);
                     $('select').trigger('chosen:updated');
                }
              });
              $('select').trigger('chosen:updated');
            });

            $(document).on('change','#im_request_form select[name=sub_category]',function(){
              $.ajax({
                type: "POST",
                url: "<?php echo base_url($this->session->userdata('forajax').'/get_sub_category_by_id'); ?>",
                data: { "id" : $(this).val() },
                dataType: 'json',
                async: true,
                success: function(data){
                    var tmp = "";
                    if(data.length > 0){
                      $.each(data, function(i, item) {
                        if(data[i].default_department != null || data[i].default_department != ''){
                          $('#im_request_form select[name=department]').val(data[i].default_department);
                          getAss(data[i].default_department,data[i].default_assign_to);
                          $('select').trigger('chosen:updated');
                        }
                        if(data[i].default_assign_to != null || data[i].default_assign_to != ''){
                          $('#im_request_form select[name=assigned_to]').val(data[i].default_assign_to);
                          $('#im_request_form select[name=activity_status]').val("ASSIGNED");
                          $('select').trigger('chosen:updated');
                        }
                      });
                    }
                }
              });
            });

            $(document).on('change','#im_request_form select[name=assigned_to]',function(){
              //alert($(this).val());
              if($(this).val() !== ''){
                $('#im_request_form select[name=activity_status]').val("ASSIGNED");
              }else{
                $('#im_request_form select[name=activity_status]').val("UNASSIGNED");
              }
              $('select').trigger('chosen:updated');
            });

            $(document).on('change','#im_request_form select[name=department]',function(){
              getAss($(this).val(),null);
            });

            function getAss(id,uid){
              var tmp = "";
              console.log(uid);
              tmp += "<option value=''>--</option>";
              $.each(user_list, function(i, item) {
                if(user_list[i].department == id){
                   tmp += "<option value='"+ user_list[i].user_id+"' "+ (uid == user_list[i].user_id ? 'selected' : '') +">"+user_list[i].name + " (" + user_list[i].user_name+ ")" +"</option>";
                }
              });
              $('#im_request_form select[name=assigned_to]').html(tmp);
              if(uid !== null){
                $('#im_request_form select[name=activity_status]').val("ASSIGNED");
              }else{
                $('#im_request_form select[name=activity_status]').val("UNASSIGNED");
              }
              $('select').trigger('chosen:updated');

              /*$.ajax({
                type: "POST",
                url: "<?php echo base_url($this->session->userdata('forajax').'/get_user_by_department'); ?>",
                data: { "id" : id },
                dataType: 'json',
                async: true,
                success: function(data){
                    var tmp = "";
                    tmp += "<option>--</option>";
                    if(data.length > 0){
                      $.each(data, function(i, item) {
                       tmp += "<option value='"+ data[i].user_id+"'>"+data[i].first_name + " " + data[i].last_name + " (" + data[i].user_name+ ")" +"</option>";
                      });
                    }
                    $('#im_request_form select[name=assigned_to]').html(tmp);
                    $('select').trigger('chosen:updated');
                }
              });*/
            }

            $(document).on('change','#im_request_form select[name=activity_status]',function(){
              switch ($(this).val()) {
                case 'UNASSIGNED':
                  $('#im_request_form select[name=assigned_to]').attr('disabled',true);
                  break;
                default:
                  $('#im_request_form select[name=assigned_to]').removeAttr('disabled');
                  break;
              }
              $('select').trigger('chosen:updated');
            });

            $(document).on('change','#im_request_form select[name=case_type]',function(){
              switch ($(this).val()) {
                case 'CMP':
                  $('#im_request_form input[name=caller_id]').removeAttr('disabled');
                  $('#im_request_form input[name=caller_acct_id]').removeAttr('disabled');
                  $('#im_request_form input[name=caller_name]').removeAttr('disabled');
                  $('#im_request_form textarea[name=caller_address]').removeAttr('disabled');
                  $('#im_request_form input[name=caller_contact]').removeAttr('disabled');
                  break;
                  case 'REQ':
                  $('#im_request_form input[name=caller_id]').removeAttr('disabled');
                  $('#im_request_form input[name=caller_acct_id]').removeAttr('disabled');
                  $('#im_request_form input[name=caller_name]').removeAttr('disabled');
                  $('#im_request_form textarea[name=caller_address]').removeAttr('disabled');
                  $('#im_request_form input[name=caller_contact]').removeAttr('disabled');
                  break;
                default:
                  $('#im_request_form input[name=caller_id]').attr('disabled',true);
                  $('#im_request_form input[name=caller_acct_id]').attr('disabled',true);
                  $('#im_request_form input[name=caller_name]').attr('disabled',true);
                  $('#im_request_form textarea[name=caller_address]').attr('disabled',true);
                  $('#im_request_form input[name=caller_contact]').attr('disabled',true);
                  break;
              }
              $('select').trigger('chosen:updated');
            });

            $('#im_request_form input[name=caller_id]').keydown(function (e) {
              if (e.which == 13) {
                $('#im_request_form #search_num').trigger('click');
                return false;
              }
            });

            $('#im_request_form #search_num').click(function(){
              $.ajax({
                type: "POST",
                url: "<?php echo base_url($this->session->userdata('forajax').'/search_num'); ?>",
                data: $('#im_request_form').serialize(),
                dataType: 'json',
                success: function(data){
                  $('#im_request_form #search_num').removeAttr('disabled');
                  if(data.length == 0){
                      notifymsg('danger','<b>Error 404:</b> Account Number not found.');
                      $('#im_request_form input[name=caller_acct_id]').val('');
                      $('#im_request_form input[name=caller_name]').val('');
                  }else{
                    notifymsg('hide','hide');
                    $.each(data, function(i, item) {
                        $('#im_request_form input[name=caller_acct_id]').val(data[i].account_id);
                        $('#im_request_form input[name=caller_name]').val(data[i].acct_name);
                    });
                  }
                },
                complete: function(){
                },
                beforeSend: function(){
                  $('#im_request_form #search_num').attr('disabled', true);
                }
              });
            });

            $('#im_request_form').validate({
                 rules: {
                     case_no: {
                        required: true,
                        number: true
                     },
                     case_date: {
                      required : true
                     },
                     case_type: {
                      required : true
                     },
                     category: {
                      required : true
                     },
                     sub_category: {
                      required : true
                     },
                     impact: {
                      required : true
                     },
                     urgency: {
                      required : true
                     },
                     case_title: {
                      required : true
                     },
                     case_details: {
                      required : true
                     },
                     desired_date: {
                      required : true
                     },
                     department: {
                      required : true
                     },
                     assigned_to: {
                      required : true
                     },
                     activity_status: {
                      required : true
                     },
                     case_status: {
                      required : true
                     },
                     caller_acct_id: {
                      required : true
                     },
                     caller_name: {
                      required : true
                     },
                     caller_address: {
                      required : true
                     },
                     caller_contact: {
                      required : true
                     }
                 }
            });

            $('#save_im').click(function(e){
              if($('#im_request_form').valid() == true){
                $.ajax({
                    type: "POST",
                    url: "<?php echo base_url($this->session->userdata('forajax').'/insert'); ?>",
                    data: $('#im_request_form').serialize(),
                    dataType: 'json',
                    success: function(data){
                       if(data[0].error != 1){
                          notifymsg("success","Success!");
                          $('#save_im').hide();
                          $('#cancel_add').hide();
                          $('#complete_btn').show();
                       }else{
                          notifymsg("danger",data[0].msg);
                       }
                    },
                    complete: function() {

                    },
                    beforeSend: function(){
                       
                    }
                });
              }
            });

            function alert_cancel(){
              if($('#uom_cn').val() != "" || $('#uom_c').val() != "" || $('#uom_n').val() != "" || $('#uom_cb').is(':checked') == false){
                  swal({
                        title: "Are you sure?",
                        text: "Your work will not be save",
                        type: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "Leave",
                        cancelButtonText: "Stay",
                        closeOnConfirm: true,
                        closeOnCancel: true },
                    function (isConfirm) {
                        if (isConfirm) {
                          swal("success");
                            close_add(); active_search();
                            notifymsg("hide","hide");
                        } else {
                            swal("Cancelled");
                        }
                    });
              }else{
                  close_add(); active_search();
                  notifymsg("hide","hide");
              }
            }
            $('#cancel_add').click(function(){
                alert_cancel();
            });
            $('#complete_btn').click(function(){
                close_add(); active_search();
            });

            $('#addX').click(function(){
              alert_cancel();      
            });
    });
 </script>  